<div class="mainbody"><!--MainBody-->
<div class="wrap_slide"><!--Slide-->
<div class="container">
<div style="display: block;" id="featured-area"><!-- Featured Area -->
<div id="s1" class="pics">
<?php
$intro->setlocation(1);
$wg_home = $intro->wget_home();
for ($i=0;$i<count($wg_home);$i++)
{
?>


<div style="background-color: rgb(0, 0, 0); position: absolute; top: 0px; left: 0px; display: none; z-index: 3; opacity: 0.7; width: 660px; height: 342px;">
<img src="uploads/intro/<?=$wg_home[$i]["img"]?>"	alt="<?=$wg_home[$i]["title"]?>" height="342" width="660">
<div class="excerpt">
<p><?=$wg_home[$i]["description"]?></p>
</div>
<a href="<?=$wg_home[$i]["link"]?>" title="<?=$wg_home[$i]["title"]?>"><span
	class="feat-overlay"></span></a></div>
<?php
}
?>


</div>
<!-- end .pics -->

<div id="slider-control">
<?php
for ($i=0;$i<count($wg_home);$i++)
{
?>
    <div class="featitem <?php if($i==0) echo "active";?>">
        <img style="opacity: <?php if($i==0) { echo 1; } else { echo "0.7"; }?>;" src="uploads/intro/<?=$wg_home[$i]["img"]?>" alt="<?=$wg_home[$i]["title"]?>" height="45" width="80">						
        <h2><?=$wg_home[$i]["title"]?></h2>
        <span class="meta">Posted by HMH on <?=date("d/m/Y",$wg_home[$i]["date"])?></span>
        <span class="order"><?=$i+1?></span>
    </div> <!-- end .featitem -->
<?php
} 
?>


    
</div> <!-- end slider-control div -->
<div class="clear"></div>
</div>
<!-- end featured area -->
<div id="main-area-wrap"><!-- end wrapper --></div>
<!-- end main area wrap --></div>
<!-- end container --></div>
<!--Slide-->

<div class="wrap_category"><!--Category-->
        	
                <div class="index_block specials"><!--SlideCategory-->
                <h2>Catalogue</h2>
                    
                        <marquee class="marquee" onmouseout="this.start()" onmouseover="this.stop()" scrolldelay="1" scrollamount="3" direction="right" behavior="alternate">
                        		<?php
                        			$wget_mar = $cat->wget();
                        			for($i=0;$i<count($wget_mar);$i++)
                        			{
                        		?>
                            	<div class="element-cata">
                                    <img id="resize-140" src="<?=$wget_mar[$i]["pcat_img"]?>" />
                                    <h4><?=$wget_mar[$i]["cat_name"]?></h4>
                                </div>
                                <?php
                        			} 
                                ?>
                        </marquee>
                    </div>
                </div><!--EndSlideCategory-->
        </div><!--Category-->


<div class="content"><!--Content-->
<div class="left_content">
				<?php
					$intro->setlocation(2);
					$l_wget = $intro->wget_home();
					for($i=0; $i<count($l_wget);$i++)
					{
				?>
				<a href="<?=$l_wget[$i]["link"]?>" class="banners-top-link">
                    <div class="content_feature2">
                    	<div class="img_feature"><img src="uploads/intro/<?=$l_wget[$i]["img"]?>" /></div>
                        <div class="noidung_feature">
                        <?=$l_wget[$i]["description"]?>
                        </div>
                    </div>
                    <strong class="banners-top-name">
                    	<span><?=$l_wget[$i]["title"]?></span>
                    </strong>
                </a>
                <?php
					} 
                ?>
                
           
               
            </div>
            
            
            <?php
			include "templates/support.php";
			?>
        </div>
<!--Content--></div>
<script type="text/javascript" src="js/top-slide/superfish.js"></script>
<script type="text/javascript" src="js/top-slide/jquery.js"></script>
<script type="text/javascript">
//<![CDATA[
	jQuery(function(){
		var $featured_area = jQuery('#featured-area');
		var $featured_item = jQuery('#featured-area div#slider-control div.featitem');
		var $slider_control = jQuery('#featured-area div#slider-control');
		var $image_container = jQuery('div#s1 > div');
		var ordernum;
		var pause_scroll = false;
			
		$featured_item.find('img').fadeTo("fast", 0.7);
		$slider_control.find("div.featitem.active img").fadeTo("fast", 1);
		$image_container.css("background-color","#fff");
		
		$image_container.hover(
			function () {
				jQuery(this).find("img").fadeTo("fast", 0.7);
			}, 
			function () {
				jQuery(this).find("img").fadeTo("fast", 1);
			}
		);
		
		function gonext(this_element){
			$slider_control.find("div.featitem.active img").fadeTo("fast", 0.7);
			$slider_control.find("div.featitem.active").removeClass('active');
			this_element.addClass('active');
			$slider_control.find("div.featitem.active img").fadeTo("fast", 1);
			ordernum = this_element.find("span.order").html();
			jQuery('#s1').cycle(ordernum - 1);
		} 
		
		$featured_item.click(function() {
			clearInterval(interval);
			gonext(jQuery(this)); 
			return false;
		});
		
		var auto_number;
		var interval;
		
		$featured_item.bind('autonext', function autonext(){
			if (!(pause_scroll)) gonext(jQuery(this)); 
			return false;
		});

		interval = setInterval(function () {
			auto_number = $slider_control.find("div.featitem.active span.order").html();
			if (auto_number == $featured_item.length) auto_number = 0;
			$featured_item.eq(auto_number).trigger('autonext');
		}, 5000);
	});
//]]>	
</script>

<script type="text/javascript">
jQuery(function(){
	jQuery('#s1').cycle({
		timeout: 0, 
		speed: 300,
		fx: 'fade'
	});
});
</script>
